<div id="HostEvent" class="HostEvent modal" role="dialog">
	<div class="modal-dialog">
		<div class="modal-content">
		<!-- modal body -->
		<div class="modal-body">
			<div class="HostEvent-header">
				<i class="fa fa-circle"  ng-class="processEventStatus(event).class"></i>
				<span class="HostEvent-title">{{event.host_name}}</span>
				<!-- close -->
				<button aria-label="{{:: strings.get('host_event_modal.CLOSE_HOST_EVENT_MODAL')}}" ng-click="closeHostEvent()" type="button" class="close">
					<i class="fa fa-times-circle"></i>
				</button>
			</div>

			<div class="HostEvent-details">
			    <div class="HostEvent-field">
			        <span class="HostEvent-field--label">{{strings.get('host_event_modal.CREATED')}}</span>
			        <span class="HostEvent-field--content">{{(event.created | longDate) || "No result found"}}</span>
			    </div>
				<div class="HostEvent-field">
			        <span class="HostEvent-field--label">{{strings.get('host_event_modal.ID')}}</span>
			        <span class="HostEvent-field--content">{{event.id || "No result found"}}</span>
			    </div>
			    <div class="HostEvent-field">
			        <span class="HostEvent-field--label">{{strings.get('host_event_modal.PLAY')}}</span>
			        <span class="HostEvent-field--content">{{event.play || "No result found"}}</span>
			    </div>
			    <div class="HostEvent-field">
			        <span class="HostEvent-field--label">{{strings.get('host_event_modal.TASK')}}</span>
			        <span class="HostEvent-field--content">{{event.task || "No result found"}}</span>
			    </div>
			    <div class="HostEvent-field">
			        <span class="HostEvent-field--label">{{strings.get('host_event_modal.MODULE')}}</span>
			        <span class="HostEvent-field--content HostEvent-field--monospaceContent">{{module_name}}</span>
			    </div>
			</div>


			<div class="HostEvent-nav">
				<!-- view navigation buttons -->
				<button ui-sref="output.host-event.json" type="button"
					class="btn btn-sm btn-default HostEvent-tab"
					ng-class="{'HostEvent-tab--selected' : isActiveState('output.host-event.json')}">
					JSON
				</button>
				<button ng-if="stdout" ui-sref="output.host-event.stdout"
					type="button" class="btn btn-sm btn-default HostEvent-tab"
					ng-class="{'HostEvent-tab--selected' : isActiveState('output.host-event.stdout')}">
					{{strings.get('host_event_modal.STANDARD_OUT')}}
				</button>
				<button ng-if="stderr" ui-sref="output.host-event.stderr"
					type="button" class="btn btn-sm btn-default HostEvent-tab"
					ng-class="{'HostEvent-tab--selected' : isActiveState('output.host-event.stderr')}">
					{{strings.get('host_event_modal.STANDARD_ERROR')}}
				</button>

			</div>
			<div class="HostEvent-body">
			<!-- views -->
			<div class="HostEvent-view--container" ui-view></div>
			</div>

			<!-- controls -->
			<div class="HostEvent-controls">
				<button ng-click="closeHostEvent()" class="btn btn-sm btn-default HostEvent-close">{{strings.get('CLOSE')}}</button>
			</div>
		</div>
		</div>
	</div>
</div>
